<template>
  <div class="container">
    <baleTable
      :tableData="tableData"
      :tableHead="tableHead"
      :isSearch="true"
      :page="page"
      @pageSizeChange="pageSizeChange"
      @handleCurrentChange="handleCurrentChange"
      @searchMethods="searchMethods"
      @tableSortChange="tableSortChange"
      ref="baleTable"
    >
      <template #headLeft>
        <div
          class="ml10 tableStats-btn tableStats-btn-active"
          @click="handleReturn"
        >
          返回
        </div>
      </template>

      <template #status="{ scope }">
        <el-tag :type="formatterStatus(scope.row.status).type">
          {{ formatterStatus(scope.row.status).name }}</el-tag
        >
      </template>
    </baleTable>
  </div>
</template>

<script>
import { ApiGetOrderList } from "@/api/index.js";
import { tableHead } from "./userListConfig.js";
export default {
  components: {
 
  },
  data() {
    return {
      tableData: [],
      tableHead,
      page: {
        page: 1,
        size: 25,
        total: 0,
      },
      form: {},
      dialogVisible: false,
      id: null,
      title: "",
      sortParams: {},
      statusFormatter: [
        {
          name: "待支付",
          code: "1",
          type: "danger",
        },
        {
          name: "进行中",
          code: "2",
          type: "warning",
        },
        {
          name: "已完成",
          code: "3",
          type: "",
        },

        {
          name: "已取消",
          code: "4",
          type: "danger",
        },
        {
          name: "已评价",
          code: "5",
          type: "",
        },
        {
          name: "退款中",
          code: "6",
          type: "danger",
        },
      ],
    };
  },

  mounted() {
    console.log(this.$route.params);
    let routeParam = this.$route.params;
    if (Object.entries(routeParam).length === 0) {
      this.$route.params.id = JSON.parse(sessionStorage.getItem("storageObj"));
      this.getUserList(this.$route.params.id); // 从本地存储中获取数据
    } else {
      this.getUserList(routeParam.id);
    }
    this.getOptions();
  },

  beforeDestroy() {
    sessionStorage.removeItem("storageObj"); // 将数据从本地存储删掉
  },
  methods: {
    getOptions() {
      const index = this.tableHead.findIndex((item) => item.prop === "status");
      if (index >= 0) {
        this.tableHead[index].searchOptions = this.statusFormatter;
      }
    },

    formatterStatus(val) {
      let data = this.statusFormatter.find((item) => {
        if (item.code == val) {
          return item;
        }
      });
      if (data) {
        return data;
      } else {
        return val;
      }
    },
    searchMethods(params) {
      this.searchParams = {};
      this.page.page = 1;
      this.searchParams = params;
      this.getUserList(this.$route.params.id);
    },
    pageSizeChange(val) {
      this.page.size = val;
      this.getUserList(this.$route.params.id);
    },
    handleCurrentChange(val) {
      this.page.page = val;
      this.getUserList(this.$route.params.id);
    },
    tableSortChange(params) {
      if (params.sort_str) {
        this.sortParams = { ...this.sortParams, ...params };
      } else {
        delete this.sortParams.sort_str;
        delete this.sortParams.sort_order;
      }
      this.page.page = 1;
      this.getUserList(this.$route.params.id);
    },

    handleReturn() {
      window.history.go(-1);
    },
    show(row) {
      console.log(row);
      this.title = "查看用户列表";
      this.dialogVisible = true;
      this.getUserList(row);
    },
    //获取用户数据
    getUserList(val) {
      let postParams = {
        ...this.searchParams,
        ...this.sortParams,
        ...this.page,
      };
      postParams.patient_id = val
      sessionStorage.setItem("storageObj", JSON.stringify(val));
      ApiGetOrderList(postParams).then((res) => {
        let { data, page } = res;
        this.tableData = data;
        this.page.total = page.total;
      });
    },

    handleClose() {
      this.dialogVisible = false;
      this.$nextTick((_) => {
        this.$refs.formRef.clearValidate();
        this.$refs.ImgUploadPath.clear();
      });
    },
  },
};
</script>

<style></style>
